<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>编辑会议</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../../static/layui-v2.6.8/layui/css/layui.css">

    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>

<body>

    <form class="layui-form" action="" lay-filter="example">

        <div class="layui-form-item"></div>
        <fieldset class="layui-elem-field layui-field-title">
            <legend>选择会议时间</legend>
        </fieldset>
        <div class="layui-form">
            <input type="hidden" name="id" class="layui-input" id="test-limit8" value="{{meet.id}}">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">会议日期</label>
                    <div class="layui-input-inline">
                        <input type="text" name="date" class="layui-input" id="test-limit1" placeholder="选择日期"
                            value="{{meet.date}}">
                    </div>
                </div>
                <br>
                <div class="layui-inline">
                    <label class="layui-form-label">开始时间</label>
                    <div class="layui-input-inline">
                        <input type="text" name="start_time" class="layui-input" id="test-limit3" placeholder="选择时间"
                            value="{{meet.start_time}}">
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">结束时间</label>
            <div class="layui-input-inline">
                <input type="text" name="finish_time" class="layui-input" id="test-limit4" placeholder="选择时间"
                    value="{{meet.finish_time}}">
            </div>
        </div>
        </div>
        </div>

        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 5px;">
            <legend>会议内容</legend>
        </fieldset>
        <div class="layui-form-item">
            <label class="layui-form-label">会议主题</label>
            <div class="layui-input-inline">
                <input type="text" name="meetname" lay-verify="required" placeholder="会议主题" autocomplete="off"
                    value="{{meet.meetname}}" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">会议地点</label>
            <div class="layui-input-block">
                <input type="text" name="place" autocomplete="off" placeholder="会议地点" class="layui-input"
                    style="width: 300px" value="{{meet.place}}">
            </div>
        </div>

        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
            <legend>参会人员</legend>
        </fieldset>
        <div class="layui-form-item"></div>
        <div id="test7" class="demo-transfer demo-tree-more">
        </div>


    </form>

    <script src="../../../static/layui-v2.6.8/layui/layui.js"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->

    <script>
        layui.use(['form', 'layedit', 'laydate',], function () {
            var form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate
                , transfer = layui.transfer
                , util = layui.util
                , $ = layui.jquery;



            //限定可选日期--不可在当前时间之后
            var ins22 = laydate.render({
                //更改为当前时间之后

                elem: '#test-limit1'
                , min: 0
                , max: 15

            });

            //限定可选时间--不可在当前时间之前
            laydate.render({
                //更改为
                elem: '#test-limit3'
                , type: 'time'
                , min: '06:30:00'
                , max: '21:30:00'
                , btns: ['clear', 'confirm']
            });

            laydate.render({
                //更改为
                elem: '#test-limit4'
                , type: 'time'
                , min: '09:30:00'
                , max: '17:30:00'
                , btns: ['clear', 'confirm']
            });

            //验证提交规则
            form.verify({
                title: function (value) {
                    if (value.length < 5) {
                        return '标题至少得5个字符啊';
                    }
                }
                , pass: [
                    /^[\S]{6,12}$/
                    , '密码必须6到12位，且不能出现空格'
                ]
                , content: function (value) {
                    layedit.sync(editIndex);
                }
            });

            layui.$(function () {
                layui.$.ajax({
                    type: 'get',
                    url: 'get_meet_personnel',
                    success: function (res) {
                        if (res.code == 200) {
                            $('#publisher').val(res.publisher)
                            personnel = res.data
                            console.log(personnel)
                            transfer.render({
                                elem: '#test7'
                                , data: personnel
                                , id: 'key123' //定义唯一索引
                                , title: ['员工列表', '参会人员']
                                , showSearch: true
                                , value: {{ list_per }}
                    })
            }
          }

        })
      })



        //监听提交并使用json格式传输数据给后端
        var meetData = {}
        form.on('submit(demo1)', function (data) {
            console.log(JSON.stringify(data.field))
            //此段代码可以获取提交的数据
            var $ = layui.$
            meetData['meet_content'] = data.field
            //ajax 提交
            $.ajax({
                type: "POST",
                dataType: "text",
                url: "edit_meet",//url
                data: JSON.stringify(meetData),  //表单数据
                success: function (data) {
                    console.log(data)
                    layer.msg('修改成功，1秒后自动关闭该窗口');
                    //延迟1秒执行，目的是让用户看到提示
                    setTimeout(function () {
                        //1、先得到当前iframe层（弹出层）的索引  ///2、提交成功关闭弹出层窗口
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    }, 1 * 1000);

                },
                error: function () {
                }
            });
            //阻止页面跳转
            return false;
        });

        util.event('lay-demoTransferActive', {
            getData: function (othis) {
                var getData = transfer.getData('key123'); //获取右侧数据
                var personnels = {}
                console.log('执行了11')
                //处理数据交
                layui.each(getData, function (index) {
                    personnels[getData[index].value] = getData[index].title
                })
                meetData['meet_personnel'] = personnels
            }
        });


        layui.$('#LAY-component-form-setval').on('click', function () {
            form.val('example', {
                "meetname": "" // "name": "value"
                , "bossname": ""
                , "place": ''
                , "date": ""
                , "start_time": ""
                , "finish_time": ""
            });
        });

      //批量绑定事件


    });

    </script>

</body>

</html>